<div id="content">
<div class="col12">

	<a href="#form_produto" class="button fancybox"><i class="icon-plus verde"></i>Novo Produto</a>
	
	<table id="produto" class="dataTable">
		<thead>
			<tr>
				<th><i class="icon-th-large"></i>Produto</th>
				<th><i class="icon-th-large"></i>Descrição</th>
				<th><i class="icon-th-large"></i>Categoria</th>
				<th><i class="icon-th-large"></i>Valor unitário</th>
				<th><i class="icon-th-large"></i>Status</th>
				<th><i class="icon-edit"></i>Editar</th>
				<th><i class="icon-trash"></i>Deletar</th>
			</tr>
		</thead>
	</table>
</div>
</div>
		

<!---------------------------CRIAR---------------------------->

<div id="form_produto" class="col12" style="display: none;">	

	<header><h2><i class="icon-th-large"></i>Criar Novo Produto</h2></header>

	<form id="upload" enctype="multipart/form-data" method="post">
	    <div>
	   		<label  for="arquivo">Imagem:</label>
	    	<div>
	    		<i class="icon-th-large"></i><input id="arquivo" placeholder="Imagem do Produto" name="arquivo" class="placeholder" type="file">
	    		<button id="submit_arquivo" class="submit" type="button" onclick="upload()" ><i class='icon-ok'></i>Upload</button>
	    	</div>
	    </div>
    </form>

	<form id="criar_produto" action="produtos/criar" method="post" data-validate="parsley">
	  
	    <div>
	   		<label  for="nome">Nome:</label>
	    	<div><i class="icon-th-large"></i><input id="nome" placeholder="Nome do Produto" name="nome" class="placeholder" data-required="true" type="text"></div>
	    </div>
	    
	    <div>
	   		<label  for="desc">Descrição:</label>
	    	<div><i class="icon-th-large"></i><input id="desc" placeholder="Descrição do Produto" name="desc" class="placeholder" data-required="true" type="text"></div>
	    </div>
	    <div>
	   		<label  for="categoria">Categoria:</label>
	    	<div><i class="icon-groups-friends"></i>
	    		<select id="categoria" name="categoria">
	    			<option value="administrador">cat1</option>
	    			<option value="bar">cat2</option>
	    			<option value="caixa">...</option>
	    		</select>
	    	</div>
	    </div>
	    <div>
	   		<label  for="valor">Valor:</label>
	    	<div><i class="icon-th-large"></i><input id="valor" placeholder="Valor unitário do produto." name="valor" class="placeholder" data-required="true" type="text"></div>
	    </div>
	    <div>
	   		<label  for="status">Status:</label>
	    	<div><i class="icon-th-large"></i><input id="status" placeholder="Valor unitário do produto." name="status" class="placeholder" data-required="true" type="text"></div>
	    </div>
		<div>
			<button id="submit" class="submit" type="submit"><i class='icon-save-floppy'></i>Salvar</button>
	    </div>
	</form>
</div>

<!---------------------------EDITAR---------------------------->

<div id="form_produto_editar" class="col12" style="display: none;">	
	<form id="editar_produto" action="produtos/atualizar" method="post" data-validate="parsley">
		<header><h2><i class="icon-th-large"></i>Editar produto</h2></header>
		  
	    <div>
	   		<label  for="editar_nome">Nome:</label>
	    	<div><i class="icon-th-large"></i><input id="editar_nome" placeholder="Nome do Produto" name="editar_nome" class="placeholder" data-required="true" type="text"></div>
	    </div>
	    <div>
	   		<label  for="editar_desc">Descrição:</label>
	    	<div><i class="icon-th-large"></i><input id="editar_desc" placeholder="Descrição do Produto" name="editar_desc" class="placeholder" data-required="true" type="text"></div>
	    </div>
	    <div>
	   		<label  for="editar_categoria">Categoria:</label>
	    	<div><i class="icon-groups-friends"></i>
	    		<select id="editar_categoria" name="categoria">
	    			<option value="administrador">cat1</option>
	    			<option value="bar">cat2</option>
	    			<option value="caixa">...</option>
	    		</select>
	    	</div>
	    </div>
	    <div>
	   		<label  for="editar_valor">Valor:</label>
	    	<div><i class="icon-th-large"></i><input id="editar_valor" placeholder="Valor unitário do produto." name="editar_valor" class="placeholder" data-required="true" type="text"></div>
	    </div>
	    <div>
	   		<label  for="editar_status">Status:</label>
	    	<div><i class="icon-th-large"></i><input id="editar_status" placeholder="Valor unitário do produto." name="editar_status" class="placeholder" data-required="true" type="text"></div>
	    </div>
		<div>
			<button id="editar_submit" class="submit" type="submit"><i class='icon-save-floppy'></i>Salvar</button>
	    </div>
	</form>
</div>